<template>
  <div class="role-setting">
    <el-dialog title="角色列表" :visible.sync="isShowRole">
      <el-checkbox-group v-model="ids">
        <el-checkbox
          :label="item.id"
          v-for="item in checkList"
          :key="item.id"
          >{{ item.name }}</el-checkbox
        >
      </el-checkbox-group>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="save">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getAllrole } from "@/api/setting";
import { userPhoto } from "@/api/user";
import { setAssignRoles } from "@/api/employees";
export default {
  name: "role-setting",
  props: {
    isShowRole: {
      type: Boolean,
      default: false,
    },
    currentId: {
      type: String,
      require: true,
    },
  },
  data() {
    return {
      //复选框选中的列表
      ids: [],
      //当前复选框的数据
      checkList: [],
    };
  },
  created() {
    this.getAllrole();
    // this.userPhoto();
  },
  methods: {
    async getAllrole() {
      let res = await getAllrole({ page: 1, pagesize: 9999 });
      //   console.log(res);
      this.checkList = res.data.rows;
    },
    async userPhoto(id) {
      let res = await userPhoto(id);
      console.log(res);
      //获取复选框选中的列表
      this.ids = res.data.roleIds;
    },

    //保存分配权限
    async save() {
      //   console.log(this.currentId);
      await setAssignRoles({ id: this.currentId, roleIds: this.ids });
      await userPhoto(this.currentId);
      this.$message.success("分配权限成功");
      //   this.userPhoto(id);
      this.$emit("update:isShowRole", false);
    },

    //取消按钮
    cancel() {
      this.ids = [];
      this.$emit("update:isShowRole", false);
    },
  },
};
</script>

<style>
</style>